<template>
  <div>
    <van-goods-action>
      <van-goods-action-icon icon="chat-o" text="客服" color="#333" />
      <van-goods-action-icon icon="cart-o" text="购物车" :badge="goodsNum"/>
      <van-goods-action-icon 
      :icon="isCollected?'star-o':'star'"
       :text="isCollected?'未收藏':'已收藏'" 
       :color="isCollected?'darkred':'#333'" 
       @click="isCollected=!isCollected"
       />
      <van-goods-action-button type="warning" text="加入购物车" @click="gotoCart" />
      <van-goods-action-button type="danger" text="立即购买" />
    </van-goods-action>
  </div>
</template>

<script>
export default {
   data() {
    return {
        isCollected:false
    }
   },
   props:['goodsNum'],
   methods: {
     gotoCart(){
        this.$emit('gotoCart')
     }
   },
};
</script>

<style lang="scss" scoped>
   .van-goods-action{
      z-index: 99999;
   }
</style>